<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
   <title>Document</title>
</head>
<body>
   <div class="container">
      你好，世界 </br>
      <span>hello word</span> </br>
      <span>hello word</span> </br>
      <span>hello word</span> 
   </div>
   <button id = 'btn'>你好</button>
   <script src="./0716/jquery.js"></script>
   <script>
      // 增删改查
      var $box = $("<div class = 'box'>天天向上</div>");
      // console.log($box[0]);
      // $(".container").append($box);  // append 后增
      // $(".container").prepend($box);  // prepend 前增
      // $(".container").after($box);  //after 兄弟后增
      // $(".container").before($box);  //before 兄弟前增

      // $box.appendTo(".container");  //appendTO 把字句

      $("#btn").click(function(){
         // console.log(1);
         var $btn_list = $(this).clone(true);
         $("body").append($btn_list);
      })
   </script>
</body>
</html>